<template>
  <div>
    <div class="intro hidden-xs-only" v-loading="loading">
      <el-row style="margin:10px 0">
        <el-button @click="zixun">众尊资讯</el-button>
        <el-button  @click="hangyeMove">行业动态</el-button>
        <el-button type="primary">法规速递</el-button>
        <el-button @click="zzStudy">众尊研究</el-button>
      </el-row>
      <el-row>
        <el-col :span="24" v-for="(item, index) in allData.rows" :key="index">
          <el-card class="box-card padd" shadow="always">
            <el-col :span="23">
              <div class="all newsDiv" @click="toDetail(item)">
                <el-col :span="4" :offset="2">
                  <img :src="item.noticeCover" class="newsImg" v-if="item.noticeCover"/>
                </el-col>
                <el-col :span="18">
                  <div class="newsChildDiv2">
                    <h4 class="mainFont">
                      {{ item.noticeTitle }}
                      <!-- 上海众尊清算服务有限公司自2005年5月创始至今上海众尊清算服务有限公司自2005年5月创始至今上海众尊清算服务有限公司自2005年5月创始至今上海众尊清算服务有限公司自2005年5月创始至今上海众尊清算服务有限公司自2005年5月创始至今 -->
                    </h4>
                    <p class="timeCls">{{ item.createTime }}</p>
                  </div>
                </el-col>
              </div>
            </el-col>
          </el-card>
        </el-col>
      </el-row>
      <div class="fenye">
        <el-pagination
          background
          layout="prev, pager, next"
          :total="totalPage"
          @current-change="handleCurrentChange"
        >
        </el-pagination>
      </div>
    </div>
    <div class="hidden-sm-and-up intro1" v-loading="loading">
      <el-row>
        <el-col :span="24" v-for="(item, index) in allData.rows" :key="index">
          <el-card class="box-card padd" shadow="always">
            <el-col :span="23">
              <div class="all" @click="toDetail(item)">
                <h4 class="mainFont">
                  {{ item.noticeTitle }}
                  <!-- 上海众尊清算服务有限公司自2005年5月创始至今上海众尊清算服务有限公司自2005年5月创始至今上海众尊清算服务有限公司自2005年5月创始至今上海众尊清算服务有限公司自2005年5月创始至今上海众尊清算服务有限公司自2005年5月创始至今 -->
                </h4>
                <p class="timeCls">{{ item.createTime }}</p>
              </div>
            </el-col>
          </el-card>
        </el-col>
      </el-row>
      <div class="fenye">
        <el-pagination background layout="prev, pager, next" :total="totalPage">
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  mounted() {
    this.getList();
  },
  methods: {
    zixun(){
      this.$router.push({
      path:"zixun"
     })
    },
    hangyeMove(){
      this.$router.push({
      path:"hangyeMove"
     })
    },
    zzStudy(){
      this.$router.push({
      path:"zzStudy"
     })
    },
    toDetail(item) {
      console.log(item);
      this.$router.push({
        path: "zixundetail",
        query: {
          noticeId: item.noticeId,
        },
      });
    },
    handleCurrentChange(e) {
      console.log(e);
      this.pageNum = e;
      this.getList();
    },
    getList() {
      this.loading = true;
      this.$axios
        .post(
          "/baseInfo/consult/getConsultlist",
          this.$qs.stringify({
            noticeType: 5,
            pageNum: this.pageNum,
            pageSize: this.pageSize,
          })
        )
        .then((response) => {
          this.loading = false;
          console.log(response.data);
          this.allData = response.data;
          this.totalPage = response.data.total;
        })
        .catch((error) => {
          console.log(error);
        });
    },
  },
  data() {
    return {
      loading: false,
      totalPage: 0,
      pageSize: 8,
      pageNum: 1,
      allData: [],
      dongshiz: require("../../../../static/images/10.png"),
    };
  },
};
</script>

<style lang="less" scoped>
.index-logo2{
  width: 70px;
  height: 90px;
}
.all{
  display: flex;
      justify-content: space-around;
}
.fenye {
  margin-top: 40px;
}
.timeCls {
  margin-top: 32px;
}
.mainFont {
      width: 442px;
  // height: 30px;
  // white-space: nowrap; /*内容超宽后禁止换行显示*/
  // overflow: hidden; /*超出部分隐藏*/
  // text-overflow: ellipsis; /*文字超出部分以省略号显示*/
   overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
      color: #1965ab;
}
.mainFont {
  margin-top: 0;
}
.padd {
  padding: 13px;
  cursor: pointer;
  margin-top: 20px;
}
/deep/.el-card__body {
  padding: 0;
}
.donszCl {
  width: 140px;
  height: 150px;
}
.dong {
  margin: 0 auto;
}
.dong1 {
  width: 350px;
}
.englinsh {
  margin-top: 15px;
}
.intro h1 {
  margin-bottom: 20px;
  text-align: center;
}
.intro {
  width: 800px;
  padding: 0;
  margin: 0 auto;
  margin-bottom: 15px;
  margin-top: 15px;
  line-height: 22px;
}
.intro1 {
  padding: 0;
  margin: 0 auto;
  margin-bottom: 15px;
  margin-top: 15px;
  line-height: 22px;
}
</style>
